<template>
	<view v-on:click="subId">
		<image v-bind:src="imgUrl" class="pic" lazy-load="true"></image>
		<view class="intro">
			<view class="desc">
				{{item.title}}
			</view>
			<view class="price"> 
				{{item.price}}
			</view>
			<view class="collect">
				{{item.cfav}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:['item'],
		data() {
			return {			
			}
		},
		computed:{
			imgUrl(){
				return this.item.image || this.item.show.img  
			}
		},
		methods: {
			subId(){
				uni.navigateTo({
					url:'/pages/detail/GoodsDetail?iid='+this.item.iid
				})
			}
		}
	}
</script>

<style scoped>
.pic{
    width: 350rpx;
    height: 500rpx;
    border-radius: 14rpx;
}
.desc{
    white-space:nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.desc,.price,.collect{
    font-size: 24rpx;
}
.price,.collect{
    display: inline-block;
}
.price{
    margin-left: 16%;
    color: pink;
}
.collect{
    position: relative;
    margin-left: 36rpx;
}
.collect::before{
    position: absolute;
    content: '';
    display: inline-block;
    width: 24rpx;
    height: 24rpx;
    left: -14px;
    top: 4rpx;
    background-repeat: no-repeat;
    background-size: 24rpx 24rpx;
    background-image:url("../../../static/img/common/collect.svg");
}
</style>
